// 接口地址：http://cba.itlike.com/public/index.php?s=/api/page/detail
// 请求方式：get

// swiper初始化代码（思考：在Vue中应该在哪里初始化）

const app = new Vue({
  el: "#app",
  data: {
    list: [],
    swiper: [],
    grid: [],
    goods: [],
  },
  async created() {
    const res = await axios.get(
      "http://smart-shop.itheima.net/index.php?s=/api/page/detail",
      {
        params: {
          pageId: 0,
        },
        headers: {
          platform: "h5",
        },
      }
    );
    this.list = res.data.data.pageData.items;
    this.getBanners();
    this.getGrids();
    this.getgoods();
  },
  mounted() {
    const mySwiper = new Swiper(".swiper", {
      speed: 1000,
      loop: true,
      autoplay: {
        disableOnInteraction: false,
        delay: 2000,
      },
      pagination: {
        el: ".swiper-pagination",
      },
      centeredSlides: true,
      observer: true, //修改swiper自己或子元素时，自动初始化swiper
      observeParents: true, //修改swiper的父元素时，自动初始化swiper
      observerUpdate: true,
    });
  },
  methods: {
    getBanners() {
      this.swiper = this.list[1].data;
    },
    getGrids() {
      this.grid = this.list[3].data;
    },
    getgoods() {
      this.goods = this.list[6].data;
    },
  },
});
